﻿<!DOCTYPE html>
<html>
<head>
	<meta charset="utf-8"/>
	<title>Lecture Demo Page</title>
	<link rel="stylesheet" type="text/css" href="lecture.css"/>
	<script type="text/javascript" src="lib/html.js"></script>
	<script type="text/javascript" src="lib/jquery-1.11.0.min.js"></script>
	<script type="text/javascript" src="lecture.js"></script>
</head>
<body>
	<h1>Lecture Demo Page</h1>
	<div class="lecture">
		<div class="slide">
			<h2>Slide #1</h2>
			<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Vestibulum arcu massa, iaculis in bibendum eget, eleifend eget mauris. Aliquam convallis est et lacinia egestas. Integer dignissim quam id pellentesque maximus. Nam id ligula sed sapien dapibus pulvinar. Etiam posuere pellentesque risus vel imperdiet. Pellentesque non finibus lorem, eget accumsan est. Mauris porttitor, ex ut feugiat mollis, lorem augue eleifend nunc, eu elementum turpis dolor non erat. Suspendisse non sem facilisis, mattis lectus in, elementum ligula. Morbi pulvinar magna ac est consequat finibus. Sed vel accumsan turpis. Nam porttitor, purus nec facilisis lacinia, libero lectus maximus dolor, at rhoncus diam metus sed eros. </p>
			<p class="ext">В режиме Speaker mode отображаются дополнительные фрагменты текста, отмеченые классом ext.</p>
		</div>
		<div class="slide">
			<h2>Slide #2</h2>
			<p>Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Nulla elementum varius nisl ac gravida. Ut sagittis ultricies porttitor. In feugiat ante vel elit sollicitudin, ac cursus magna faucibus. Aliquam tincidunt velit a euismod vulputate. Aenean luctus euismod ultrices. Curabitur tincidunt aliquam diam, ut maximus augue sollicitudin vitae. Aenean at condimentum erat. Maecenas tempor vehicula risus sit amet suscipit. Mauris laoreet dui eu condimentum pretium. </p>
		</div>
		<div class="slide">
			<h2>Slide #3</h2>
			<p>Sed lacinia vel dolor eu tempor. Pellentesque tincidunt nulla condimentum, faucibus tortor ut, rhoncus nulla. Nunc pharetra pellentesque semper. Cras molestie lobortis leo, ac suscipit nulla tempor sed. Sed sagittis egestas lobortis. Ut et accumsan lorem. Curabitur felis lorem, pretium a lobortis ac, tincidunt consectetur ante. Pellentesque ut justo nisi. </p>
		</div>
		<div class="slide">
			<h2>Slide #4</h2>
			<p>Pellentesque pretium lacus mauris, non pulvinar diam gravida et. Mauris eget pellentesque dui, ut ullamcorper nisi. Sed at odio blandit, tempor turpis eget, dapibus risus. Donec ac consequat quam. Duis rhoncus pellentesque justo sit amet porttitor. Mauris eu fringilla massa. Ut pharetra diam ac velit consectetur, rhoncus scelerisque tellus consequat. Fusce bibendum neque porttitor molestie vestibulum. Proin nisi purus, finibus et varius sit amet, ornare et risus. Cras sodales, quam nec malesuada dapibus, risus lacus lobortis augue, sed commodo dui mauris nec elit. Curabitur aliquet eu velit vel elementum. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In eu vehicula sapien, sit amet commodo lectus. Sed posuere erat egestas risus tempor, quis mattis augue venenatis. Nunc consectetur tortor id ultricies tristique.</p>
		</div>
	</div>
	<div>
		<input type="button" class="btBackward" value="&lt;&lt;"/>
		<span class="display"></span>
		<input type="button" class="btForward" value="&gt;&gt;"/>
	</div>
	<p><a href="#speaker">Speaker mode (refresh page!)</a></p>
</body>
</html>